<template>
  <div class="flex">
    <n-carousel show-arrow autoplay>
      <ad-item
        :adInfo="item"
        v-for="(item, i) in ads"
        :key="i"
        style="width: 100%; height: 350px"
      ></ad-item>
    </n-carousel>
    <div class="sx flex">
      <login-form></login-form>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { NCarousel } from "naive-ui";
import AdItem from "@/components/shop/AdItem.vue";
import LoginForm from "@/components/user/LoginForm.vue";

const ads = [
  {
    url: "#/asd",
    image: "http://www.wzxfyl.com/ulfile/adpic/ad2017051217337090638966.jpg",
  },
  {
    url: "#/asd",
    image: "http://www.wzxfyl.com/ulfile/adpic/ad2019070417194708777557.jpg",
  },
  {
    url: "#/asd",
    image: "http://www.wzxfyl.com/ulfile/adpic/ad2019072215133197962379.png",
  },
  {
    url: "#/asd",
    image: "http://www.wzxfyl.com/ulfile/adpic/ad2019070410060314427380.png",
  },
];
</script>
<style lang="scss" scoped>
.sx {
  background: #fff;
  min-width: 25em;
  margin-left: 0.5em;
  align-items: center;
}
</style>